import Vue from 'vue'
import VueRouter from 'vue-router'



// 路由懒加载，用到再加载
// 通常路由需要定义很多不同页面，一般情况下会打包到一个js文件中，全都打包到一个js文件中必然造成这个文件的臃肿
// 如果我们一次性把所有的页面请求下来，可能需要花费一定时间，会造成用户电脑空白
// 使用懒加载，可以将懒加载的路由页面打包成一个个js代码块，只有路由被访问时才加载这个代码块
const Home = () => import('views/home/Home')
const Category = () => import('views/category/Category')
const Cart = () => import('views/cart/Cart')
const Profile = () => import('views/profile/Profile')
const Detail = () => import('views/detail/Detail')

Vue.use(VueRouter)


// 解决路由多次点击报错（不影响程序运行）
const originalReplace = VueRouter.prototype.replace;
VueRouter.prototype.replace = function replace(location) {
  return originalReplace.call(this, location).catch(err => err);
};

const routes = [
  {
    path: '',
    redirect: '/home',
  },
  {
    path: '/home',
    component: Home
  },
  {
    path: '/category',
    component: Category
  },
  {
    path: '/cart',
    component: Cart
  },
  {
    path: '/profile',
    component: Profile
  },
  {
    path: '/detail/:id',
    component: Detail
  }
]

const router = new VueRouter({
  mode: 'history',
  routes
})

export default router
